import { lazy, Suspense } from 'react'
import {
  Router,
  Route,
  Switch,
  Redirect,
} from 'react-router-dom'
import AuthRoute from 'components/AuthRoute/index'
import { history } from 'utils/history'
import Loading from 'components/Loading'
const Login = lazy(() => import('pages/Login'))
const Layouts = lazy(() => import('pages/layouts'))

const App = () => {
  return (
    <>
      <Suspense fallback={<Loading></Loading>}>
        <Router history={history}>
          <Switch>
            <Redirect exact from="/" to="/login" />
            <AuthRoute path="/login" component={Login} />
            <AuthRoute path="/" component={Layouts}></AuthRoute>
          </Switch>
        </Router>
      </Suspense>
    </>
  )
}

export default App
